import axios from 'axios'
import store from '@/store'
import router from '@/router'
import { Notify } from 'vant'
import { refreshToken } from '@/api/user/index.js'
import { getStorage } from '@/utils/storage.js'
const request = axios.create({
  baseURL: 'http://geek.itheima.net',
  timeout: 20000,
})
// 配置请求拦截器
request.interceptors.request.use(
  (config) => {
    const token = getStorage('toutiaoToken')
    if (token) {
      config.headers.Authorization = `Bearer ${token}`
    }
    return config
  },
  (error) => {
    return Promise.reject(error)
  }
)
// 配置响应拦截器
request.interceptors.response.use(
  (response) => {
    return response
  },
  async (error) => {
    // console.log(error)
    if (error.response.status === 401) {
      // 问题:
      // token值过了有效期
      // 手动破坏token 使其失效
      // 都会导致报401错误，证明用户身份信息过期，需要重新登录
      // 解决:
      // 方法1:让用户强制跳转到登录页面，重新登录 用户有感知的
      // 方法2:当token过期时，调用接口刷新token 并再次在请求头带上新的token值 然后重新发起失败的那个请求 用户无感知
      // 这里使用方法2
      store.commit('setToken', '') // 清除本地token
      // 调用接口
      const { data: res } = await refreshToken()
      if (res.message !== 'OK') {
        return Notify({ type: 'danger', message: res.message })
      }
      // 把返回的值作为新的token值 分别存储到vuex和本地中
      store.commit('setToken', res.data.token)
      // 把新的token值再次带在请求头上
      error.config.headers.Authorization = 'Bearer ' + store.state.token
      // 重新发起失败的那个请求
      return axios(error.config)
    } else if (
      error.response.status === 500 &&
      error.config.method === 'put' &&
      error.config.url === '/v1_0/authorizations'
    ) {
      // token值过期了 用于刷新token的值也过期了
      // 只能强制跳转到登录页面 让用户重新登录
      Notify({ type: 'danger', message: '身份信息已过期，请重新登录!' })
      store.commit('setToken', '') // 清除本地token
      router.replace({
        // 跳转到登录页后，保存用户上次访问的页面的路径，放在登录页面的路径上，方便登录后直接进入上次访问的页面,
        path: `/login?path=${router.currentRoute.fullPath}`,
      })
    } else {
      return Promise.reject(error)
    }
  }
)
export default request
